<template>
  <!-- 商户版 销售列表  -->
  <div class="goods-list-page ">
    <div class="search-box">
      <div v-if="queryParams.retailKey!='zysc'" style="margin-bottom:15px">
        <el-button class="font16" icon="el-icon-back" plain type="primary" @click="close">返回 </el-button>
      </div>
      <div style="font-size:16px;font-weight:bold;margin-bottom:15px" class="flex" v-if="queryParams.retailKey!='zysc'">
        <span style="width:100px;text-align:right">分销网名称：</span><span>{{retailName}}</span>
      </div>
      <div class="game-box flex">
        <span class="select-label font16">选择游戏：</span>
        <div class="select-box">
          <selectBtnVue :options="{
              valueKey: 'id',
              labelKey: 'name',
              itemWidth: '100px',
              limitShow: '100',
            }" :selected="queryParams.gameId" :list-data="gameTypes" @change="selectGameType"></selectBtnVue>
        </div>
        <!-- gameTypes -->
      </div>
      <div class="game-box flex" v-if="GameSelectedType === 0&&sysList&&sysList.length">
        <span class="select-label font16">系统：</span>
        <div class="select-box">
          <selectBtnVue :options="{
              valueKey: 'id',
              labelKey: 'fieldName',
              limitShow: '10',
            }" :selected="queryParams.systemId" :list-data="sysList" @change="systemChange"></selectBtnVue>
        </div>
      </div>
      <div class="game-box flex" v-if="GameSelectedType === 0&&carrierList&&carrierList.length">
        <span class="select-label font16">运营商：</span>
        <div class="select-box">
          <selectBtnVue :options="{
              valueKey: 'id',
              labelKey: 'fieldName',
              limitShow: '10',
            }" :selected="queryParams.carrierId" :list-data="carrierList" @change="getAreaList"></selectBtnVue>
        </div>
      </div>
      <div class="game-box flex" v-if="(GameSelectedType === 0 || GameSelectedType)&&areaList&&areaList.length">
        <span class="select-label font16">大区：</span>
        <div class="select-box">
          <selectBtnVue :options="{
              valueKey: 'id',
              labelKey: 'fieldName',
              limitShow: '10',
            }" :selected="queryParams.groupId" :list-data="areaList" @change="getServiceList"></selectBtnVue>
        </div>
      </div>
      <div class="game-box flex" v-if="(GameSelectedType === 0 || GameSelectedType)&&serverList&&serverList.length">
        <span class="select-label font16">服务器：</span>
        <div class="select-box">
          <selectBtnVue :options="{
              valueKey: 'id',
              labelKey: 'fieldName',
              limitShow: '10',
            }" :selected="queryParams.serverId" :list-data="serverList" @change="serverChange"></selectBtnVue>
        </div>
      </div>
      <div class="game-box input-box flex">
        <div>
          <el-select size="small" v-model="queryParams.tenantId" placeholder="请选择店铺" clearable filterable>
            <el-option v-for="dict in tenantList" :key="dict.tenantId" :label="dict.tenantName" :value="dict.tenantId" />
          </el-select>
        </div>
        <div style="margin-left: 15px;">
          <el-input clearable placeholder="请输入你要查询的商品关键词、账号等" v-model="queryParams.keyWord" size="small" @change="search"></el-input>
          <!-- <el-button
            class="search-btn"
            type="primary"
            size="small"
            icon="el-icon-search"
            @click="search"
            >查询</el-button
          > -->
        </div>
        <div class="flex search-input">
          <el-input clearable placeholder="请输入商品编号" v-model="queryParams.id" size="small" @change="search"></el-input>
          <!-- <el-select style="margin-left:10px" label="供货商" prop="createIds" v-if="pageType != 'pool'" multiple v-model="queryParams.createIds" placeholder="请选择供货商" size="small" clearable filterable>
              <el-option v-for="dict in supplyList" :key="dict.userId" :label="dict.nickName" :value="dict.userId" />
            </el-select> -->
          <el-button class="search-btn" type="primary" size="small" icon="el-icon-search" @click="search">查询</el-button>
        </div>
        <div>
          <el-button class="search-btn" type="primary" size="small" icon="el-icon-refresh-right" plain @click="initPage">重置</el-button>
        </div>
        <!-- 货源配置按钮 -->
        <div v-if="queryParams.retailKey=='zysc'&&checkPermi(['zysc:huoyuanpeizhi'])">
          <el-button class="search-btn" type="primary" size="small" icon="el-icon-connection" @click="goHuoyuan">货源配置</el-button>
        </div>
        <div v-if="queryParams.retailKey=='zysc'">
          <el-button class="search-btn" type="warning" plain size="small" icon="el-icon-connection" @click="getDaishouwode">代售我的</el-button>
        </div>
      </div>
      <div class="game-box flex">
        <span class="select-label font16">历史搜索：</span>
        <div class="hot-box flex">
          <span class="hot-word" v-for="(item, i) in hotWords" :key="i">
            <span @click="hotWordClick(item)">{{ item }}</span>
            <span class="el-icon-error" @click="delHotWord(item)"></span>
          </span>
        </div>
      </div>
    </div>
    <div class="table_box customTab" v-loading="loading">
      <el-table stripe :data="tableData.records" @sort-change="sortFun" style="width: 100%;">
        <!-- <el-table-column type="selection" width="55">
            </el-table-column> -->
        <el-table-column label="商品编号" width="130" label-position="left" prop="id" sortable="custom" sort-by>
          <template slot-scope="scope">
            <span v-show="scope.row.ifself" class="sign" :class="{ ping: scope.row.ifself == 2 }">{{ scope.row.ifself == 1 ? "自" : "代" }}</span>
            <span>{{ scope.row.id }}</span>
          </template>
        </el-table-column>
        <el-table-column label="游戏名称" width="100" prop="gameName" />
        <el-table-column label="区服" width="140" prop="systemName">
          <template slot-scope="scope">
            <span>{{
                  scope.row.systemName ? scope.row.systemName + "/" : ""
                }}</span>
            <span>{{
                  scope.row.carrierName ? scope.row.carrierName + "/" : ""
                }}</span>
            <span>{{
                  scope.row.groupName ? scope.row.groupName + "/" : ""
                }}</span>
            <span>{{ scope.row.serverName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="实名状态" width="130" prop="shiming" />
        <el-table-column label="售价" width="100" prop="newPrice" v-if="pageType == 'sale'">
          <template slot-scope="scope">
            <div>{{ scope.row.newPrice }}</div>
          </template>
        </el-table-column>
        <el-table-column sortable="custom" sort-by label="提号价格" width="130" prop="price">
                <template slot-scope="scope">
                  <div v-if="scope.row.rise != 10 && scope.row.tenantId !=shopInfo.tenantId">
                     {{ getRise(scope.row) }}<span style="font-size: 13px;color: red;margin-left: 2px;">({{ scope.row.rise }}折)</span>
                  </div>
                  <div v-else>{{ scope.row.newPrice }}</div>
                </template>
                </el-table-column>
        <el-table-column label="商品描述" min-width="300" prop="des">
          <template slot-scope="scope">
            <el-tooltip class="item" effect="dark" :content="scope.row.des" placement="top-start">
              <div class="zdy-des">{{ scope.row.des }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column :label="pageType=='sale'?'供货价':'供货价'" width="100" prop="price" sort-by sortable="custom" />
        <el-table-column label="供货商" width="150" prop="supplyName">
          <template slot-scope="scope">
            <div v-if="allYouzhiMap&&allYouzhiMap[scope.row.tenantId]">
              <youzhiName :name="scope.row.supplyName"></youzhiName>
            </div>
            <div v-else>
              {{ scope.row.supplyName }}
            </div>

          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" :width="'200'">
          <template slot-scope="scope">
            <el-button type="text" @click="openIM(scope.row)">联系他</el-button>
            <el-button v-if="checkPermi(['caigoudingdan'])" type="text" @click="openAddOrder(scope.row)">立即提号</el-button>
            <el-button type="add" @click="viewGoods(scope.row)">商品详情</el-button>
            <el-button v-if="pageType=='sale'" ref="copyBtn1" type="text" @click="keyCopy(scope.row)">复制</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="pages-box">
      <!-- <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="queryParams.pageNum"
        :page-sizes="[10, 20, 30, 40, 50, 60]"
        :page-size="queryParams.pageSize"
        layout="total, sizes, prev, pager, next"
        :total="tableData.total"
      ></el-pagination> -->
      <pagination v-show="tableData.total>0" :total="tableData.total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" @pagination="getList" />
    </div>
    <!-- 一下是弹出框 -->
    <!-- 联系对方 -->
    <kefuList ref="kefuList"></kefuList>
    <!-- 选号网 -->
    <el-dialog title="我的选号网" :visible.sync="qrCodeShow" width="620px">
      <div style="margin-bottom:15px;margin-left:100px">
        <label for="">
          <b>店铺地址：</b>
          <el-input style="width:250px" @keyup.enter.native="otherShopAddressChange" v-model="otherShopAddress" placeholder="淘宝、PDD等电商平台店铺地址"></el-input>
          <el-button type="primary" @click="otherShopAddressChange">保存</el-button>
        </label>
      </div>

      <div ref="qrcode" style="width:300px; height:300px;margin:0 auto;margin-bottom:15px"></div>
      <div class="link-box">
        <div class="">
          <span class="mylink"> <a :href="phoneLink" target="_blank">{{phoneLink}}</a></span>
          <el-button size="mini" @click="copy(phoneLink)">复制</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 商品预览 -->
    <!-- <el-dialog title="商品预览" :visible.sync="goodsPageShow" width="1400px" @close="currentUrl = ''">
      <iframe :src="currentUrl" frameborder="0" style="width:100%;height:calc(100vh - 220px)"></iframe>

    </el-dialog> -->
    <!--联系供货商 -->
    <!-- <el-dialog title="供货商信息" close-on-click-modal :visible.sync="supplyShow" width="620px">
      <div style="margin-bottom:15px;font-size:16px;text-align:center;line-height:30px">
        <div for="">
          <b>商品编号：</b>
          <span>{{currentSupply.goodsId}}</span>
        </div>
        <div for="">
          <b>供货商：</b>
          <span>{{currentSupply.name}}</span>
        </div>
        <div for="">
          <b>手机号：</b>
          <span>{{currentSupply.tel}}</span>
        </div>
        <div style="margin:20px 0;">
          想结识更多同行请添加虞都互联系统商家交流群，微信 yudu3518（备注：进群）
        </div>
      </div>

    </el-dialog> -->
    <!-- 谁代售了我的号 -->
    <el-dialog title="代售我的商家" close-on-click-modal :visible.sync="daishouwodeShow" width="960px">
      <div style="margin-bottom:15px;font-size:16px;text-align:center;line-height:30px">
        <el-table border stripe :data="daishouwode">
          <!-- <el-table-column type="selection" width="55">
            </el-table-column> -->
          <el-table-column align="center" label="商家" prop="tenantName">
          </el-table-column>
          <el-table-column align="center" label="代售游戏" prop="gameNames" />
        </el-table>
      </div>

    </el-dialog>

    <fenxiaoPickDialog ref="fenxiaoPickDialog"></fenxiaoPickDialog>
    <goodsInfoDetail ref="goodsInfoDetail"></goodsInfoDetail>


    <pickDialog ref="pickDialog"></pickDialog>
  </div>
</template>

<script>
import QRCode from "qrcodejs2";
import selectBtnVue from "../../components/select-btn.vue";
import kefuList from "@/components/common/kefuList.vue";
import { mapGetters } from "vuex";
import { getSupplyList, getGameList } from "@/api/info/info";
import { salelistAccount } from "@/api/info/account";
import goodsListApi from "@/api/gameConfig/goodsList";
import gameDictionaryApi from "@/api/gameConfig/gameDictionary";
import { updatOtherShopAddress } from "@/api/system/user";
import fenxiaoPickDialog from "../components/fenxiaoPickDialog.vue";
import customerServiceApi from "../../../../api/pickUp/customerService";

import pickDialog from "../../saleOrder/components/pickDialog";
// 查看商品弹窗
import goodsInfoDetail from "../../goodsList/goodsInfoDetail.vue";
export default {
  name: "ZyscShangpin",
  components: {
    selectBtnVue,
    kefuList,
    fenxiaoPickDialog,
    goodsInfoDetail,
    pickDialog
  },
  // props: ["type"],
  data() {
    return {
      daishouwodeShow: false,
      daishouwode: [],

      supplyShow: false,
      currentSupply: {},
      currentUrl: "",
      goodsPageShow: false,
      qrCodeShow: false,
      Code_url: "",
      qrcode: null,
      phoneLink: "",
      computerLink: "",
      hotWords: [], //热搜词
      outIdsData: [],
      supPhoneNum: "",
      gameList: [], //游戏列表
      gameTypes: [], //销售列表的游戏列表
      tableData: {
        records: [],
        total: 0,
      },
      pageType: "sale",
      GameSelectedType: "", //筛选的游戏的类型
      sysList: [],
      carrierList: [], //运营商列表
      areaList: [], //大区列表
      serverList: [], //服务器列表
      selects: [], //表格的选中项
      ids: [], //表格选中的ids
      pushApiList: [],
      morePrice: [], //更多价格

      supplyList: [],
      levelArr: [],
      sinNumShow: "",
      unsoldFrom: {
        note: null,
      },
      showDialogTitle: "",
      dialogFormVisible: false,
      tempData: null,
      loading: false,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        saleState: "1",
        createIds: [],
        sort: "",
        sortColumn: "",
        dataType: "all",
        keyWord: "",
        id: "",
      },
      regionalArr: [], //区服列表
      copyVlaue: "",
      customAttr: null,
      retailDomain: {},
      otherShopAddress: "",
      retailName: "",
    };
  },
  watch: {
    // type: {
    //   handler(newVal) {
    //     this.pageType = newVal;
    //     this.initPage(newVal);
    //   },
    //   immediate: true,
    // },
    shopInfo: {
      handler(newVal) {
        if (newVal && newVal.otherShopAddress)
          this.otherShopAddress = newVal.otherShopAddress;
      },
      immediate: true,
      deep: true,
    },
    queryData: {
      handler(newVal) {
        if (newVal.retailKey) {
          this.queryParams.retailKey = newVal.retailKey;
          this.retailName = newVal.retailName;
          this.initPage();
        } else {
          return this.$message.error("参数错误！");
        }
      },
      immediate: true,
      deep: true,
    },
  },
  computed: {
    ...mapGetters(["userInfo", "shopInfo"]),
    queryData() {
      return this.$route.query;
    },
    allYouzhiMap() {
      return this.$store.getters.allYouzhiMap;
    },
    tenantList() {
      return this.$store.getters.tenantList;
    },
  },
  created() {
    // this.getGameList();
    let hotWords = localStorage.getItem("hotKeyWords");
    if (hotWords) {
      this.hotWords = JSON.parse(hotWords);
    }
    // this.getData();
  },
  methods: {
     getRise(row) {
      return Math.round(row.price * (row.rise / 10))
    },
    // 返回
    close() {
      window.history.go(-1);
    },
    // 打开货源配置
    goHuoyuan() {
      this.$router.push({
        path: "/ziyingshangcheng/page/config?retailKey=zysc",
      });
    },
    // 获取代售我的商家列表
    getDaishouwode() {
      goodsListApi.getDaishouwode().then((res) => {
        this.daishouwode = res.data;
        this.daishouwodeShow = true;
      });
    },
    // 保存三方店铺地址
    otherShopAddressChange() {
      updatOtherShopAddress({
        tenantId: this.shopInfo.tenantId,
        otherShopAddress: this.otherShopAddress,
      }).then((r) => {
        if (r.code == 200) {
          this.$message.success("保存成功");
          this.$store.dispatch("getShopInfo", this.shopInfo.tenantId);
        }
      });
    },
    // 查看商品详情页
    viewGoods(info) {
      this.$refs.goodsInfoDetail.open(info);
      // if (this.shopInfo && this.shopInfo.domain) {
      //   let host = this.shopInfo.domain;
      //   if (host.includes(",")) {
      //     host = host.split(",")[0];
      //   }
      //   let hostt = `http://${host}/pages/detail/index?id=${goodsId}&flag=saleList`;
      //   window.open(hostt, "_blank");
      // } else {
      //   this.$message.error("未找到自营商城域名！");
      // }
    },
    // 初始化
    initPage() {
      // this.pageType = pageType;
      this.sysList = [];
      this.carrierList = [];
      this.areaList = [];
      this.serverList = [];
      let saleState = this.queryParams.saleState;
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        saleState: saleState,
        sort: "",
        sortColumn: "",
        dataType: null,
        keyWord: "",
        id: "",
        retailKey: this.queryParams.retailKey,
      };
      this.getGames();
    },

    // 获取销售列表的游戏列表
    // 获取游戏列表
    getGames() {
      getGameList({
        retailKey: this.queryParams.retailKey,
      }).then((res) => {
        this.gameTypes = res.data;
        this.selectGameType(this.gameTypes[0].id);
      });
    },
    // 获取列表
    getList() {
      if (!this.queryParams.retailKey) {
        return this.$message.error("参数错误！");
      }
      this.tableData.records = [];
      this.loading = true;
      // 销售列表

      salelistAccount(this.queryParams)
        .then((response) => {
          this.$nextTick(() => {
            this.loading = false;
            if (response.rows && response.rows.length) {
              this.tableData.records = JSON.parse(
                JSON.stringify(response.rows)
              );
              this.tableData.total = response.total;
            } else {
              this.tableData.records = [];
              this.tableData.total = 0;
              // this.$alert('暂无货源，请先货源配置中进行配置', '提示', {
              //   confirmButtonText: '确定'
              // });
            }
          });
        })
        .catch((err) => {
          this.loading = false;
        });
    },
    // 立即下单  打开下单弹窗
    async openAddOrder(row) {
      if (row.tenantId == this.shopInfo.tenantId) {
        this.$refs.pickDialog.open(row, "kefu");
      }else {
        this.$refs.fenxiaoPickDialog.open(row);
      }
      
      // if (await this.getSupplyGuaranteeConfig(row.tenantId)) {
      //   this.$refs.fenxiaoPickDialog.open(row);
      // } else {
      //   return this.$message.error("供货商未开通在线支付功能！");
      // }
    },
    // // 获取供货商的包赔配置
    // async getSupplyGuaranteeConfig(tenantId) {
    //   this.baopeiList = [];
    //   try {
    //     const res = await customerServiceApi.getConfigByTenantId({
    //       configKey: "payOnline",
    //       tenantId: tenantId,
    //     });
    //     if (res.data && res.data.configValue == 2) {
    //       return false;
    //     } else {
    //       return true;
    //     }
    //   } catch (error) {
    //     return false;
    //   }
    // },
    // 联系客服
    // 联系客服
    openIM(row) {
      // 打开客服列表
      this.$refs.kefuList.open(row.tenantId, 1, {
        gameId: row.gameId,
        gameName: row.gameName,
      });
    },
    copy(txt) {
      this.$copyText(txt).then((res) => {
        this.$message.success("已复制到剪切板");
      });
    },
    // 复制信息
    // 复制商品信息
    keyCopy(item) {
      let copyVlaue =
        "商品ID：" +
        item.id +
        // "\n" +
        // "自编号：" +
        // item.thirdId +
        "\n" +
        "大区：" +
        `${item.systemName ? item.systemName + "/" : ""}${
          item.carrierName ? item.carrierName + "/" : ""
        }${item.groupName}${item.serverName}` +
        "\n" +
        "售价：" +
        item.newPrice +
        "\n" +
        "简介：" +
        item.des +
        "\n";
      // "商品截图：" +
      // hostt;

      this.$copyText(copyVlaue).then((res) => {
        this.$message.success("已复制到剪切板");
      });
    },
    //获取供货商接口
    getUserList() {
      getSupplyList("supplyCustomer").then((res) => {
        if (res.code == 200) {
          this.supplyList = res.data;
        }
      });
    },

    // 删除热搜词
    delHotWord(item) {
      let i = this.hotWords.indexOf(item);
      if (i != -1) {
        this.hotWords.splice(i, 1);
        localStorage.setItem("hotKeyWords", JSON.stringify(this.hotWords));
      }
    },
    // 点击热搜词
    hotWordClick(item) {
      this.queryParams.keyWord = this.queryParams.keyWord + " " + item;
    },
    // 搜索
    search() {
      this.queryParams.pageNum = 1;
      this.queryParams.pageSize = 10;
      this.getList();
      if (this.queryParams.keyWord) {
        let arr = this.queryParams.keyWord.split(" ");
        arr.forEach((r) => {
          if (r) {
            let i = this.hotWords.indexOf(r);
            if (i == -1) {
              this.hotWords.unshift(r);
            } else {
              this.hotWords.splice(i, 1);
              this.hotWords.unshift(r);
            }
            if (this.hotWords.length > 30) {
              this.hotWords.splice(this.hotWords.length - 1, 1);
            }
            localStorage.setItem("hotKeyWords", JSON.stringify(this.hotWords));
          }
        });
      }
    },
    // 表格排序
    sortFun(val) {
      this.queryParams.sort = val.order;
      this.queryParams.sortColumn = val.prop;
      this.getList();
    },

    // 表格选择项改变
    handleSelection(arr) {
      ////console.log("%c Line:442 🍆 表格选择改变", "color:#f5ce50", arr);
      this.selects = arr;
      this.ids = [];
      if (arr.length == 0) {
        this.ids = [];
      } else {
        arr.forEach((t) => {
          this.ids.push(t.id);
        });
      }
    },



    // 选择游戏
    selectGameType(val) {
      ////console.log("%c Line:1016 🌭 val", "color:#4fff4B", val);
      if (!val) {
        val = null;

        return;
      }
      this.sysList = [];
      this.carrierList = [];
      this.areaList = [];
      this.serverList = [];
      let dataType = this.queryParams.dataType;
      let saleState = this.queryParams.saleState;
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        saleState: saleState,
        sort: "",
        sortColumn: "",
        dataType: dataType,
        keyWord: "",
        id: "",
        retailKey: this.queryParams.retailKey,
      };
      this.queryParams.gameId = val;
      this.gameTypes.forEach((r) => {
        if (r.id == val) {
          this.GameSelectedType = r.type;
        }
      });

      if (this.GameSelectedType === 0) {
        // 手游
        // 获取系统列表和运营商列表
        this.getSysList();
        this.getYysList();
      } else {
        // 端游
        // 获取大区列表
        this.getAreaList2();
      }

      this.search();
    },
    // 获取系统列表
    getSysList() {
      gameDictionaryApi
        .getChildList({
          gameId: this.queryParams.gameId,
          systemKey: "system",
        })
        .then((res) => {
          res.rows.unshift({
            fieldName: "全部",
            id: "",
          });
          this.sysList = res.rows;
        });
    },
    // 获取运营商列表
    getYysList() {
      gameDictionaryApi
        .getChildList({
          gameId: this.queryParams.gameId,
          systemKey: "carrier",
        })
        .then((res) => {
          res.rows.unshift({
            fieldName: "全部",
            id: "",
          });
          this.carrierList = res.rows;
        });
    },
    // 系统改变
    systemChange(e) {
      this.queryParams.systemId = e;
    },
    // 运营商改变  获取大区列表
    getAreaList(e) {
      this.queryParams.carrierId = e;
      let obj = {
        gameId: this.queryParams.gameId,
        systemKey: "group",
      };
      this.queryParams.groupId = "";
      this.queryParams.serverId = "";
      this.serverList = [];
      this.areaList = [];

      // 运营商改变 找出选择的运营商的对象
      if (e) {
        this.carrierList.forEach((i) => {
          if (i.id == e) {
            obj.systemKey = i.systemKey + "group";
          }
        });
      }
      gameDictionaryApi.getChildList(obj).then((res) => {
        res.rows.unshift({
          fieldName: "全部",
          id: "",
        });
        this.areaList = res.rows;
      });
    },
    // 大区改变  获取服务器列表
    getServiceList(e) {
      this.queryParams.groupId = e;
      this.queryParams.serverId = "";

      if (e) {
        gameDictionaryApi
          .getList({
            parentId: e,
          })
          .then((res) => {
            res.rows.unshift({
              fieldName: "全部",
              id: "",
            });
            this.serverList = res.rows;
          });
      } else {
        this.serverList = [];
      }
    },
    //端游 直接获取大区
    getAreaList2() {
      let obj = {
        gameId: this.queryParams.gameId,
        systemKey: "group",
      };
      gameDictionaryApi.getChildList(obj).then((res) => {
        this.areaList = res.rows;
      });
    },
    // 服务器改变
    serverChange(e) {
      this.queryParams.serverId = e;
    },
    //重置
    resetQuery() {
      let dataType = this.queryParams.dataType;
      let saleState = this.queryParams.saleState;
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        saleState: saleState,
        sort: "",
        sortColumn: "",
        dataType: dataType,
        keyWord: "",
        id: "",
        retailKey: this.queryParams.retailKey,
      };
      this.getList();
    },
  },
};
</script>
<style lang="scss" scoped>
.goods-list-page {
  // height: calc(100vh - 137px);
  // overflow-y: auto;
}

// ::v-deep .el-dialog__body {
//   max-height: calc(100vh - 120px) !important;
//   padding-bottom: 0 !important;
// }
.zdy-des {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin: 6px 0;
}

.search-form-new ::v-deep .el-input {
  width: 200px !important;
}

.sign {
  display: inline-block;
  width: 20px;
  height: 20px;
  background-color: #ffcc66;
  border-radius: 50%;
  font-size: 12px;
  line-height: 20px;
  text-align: center;
  color: #fff;
  margin-right: 5px;

  &.ping {
    background-color: #1890ff;
  }
}

// .tuisongbtn ::v-deep .el-dropdown-menu {
//   max-height: 600px;
//   overflow-y: hidden;
// }
.search-box {
  background-color: $fff;
  border-radius: 10px;
  padding: 20px;
  padding-bottom: 1px;
  padding-top: 0.1px;
  .game-box {
    margin-bottom: 10px;
  }
  .search-input {
    margin-left: 15px;
  }
  .input-box {
    margin-top: 20px;
  }
}
.select-label {
  flex-shrink: 0;
  width: 100px;
  text-align: right;
}
.hot-box {
  color: $primary;
  flex-wrap: wrap;
  max-height: 60px;
  overflow: hidden;
  .hot-word {
    margin-right: 20px;
    margin-bottom: 10px;

    > span {
      cursor: pointer;
    }
    .el-icon-error {
      margin-left: 5px;
    }
  }
}
.search-btn {
  margin-left: 10px;
}
.customTab {
  margin-top: 16px;
}
#qrCode {
  display: inline-block;
  margin: 0 auto;
  /*水平居中*/
  position: relative;
  top: 15%;

  /* img: {
    width: 200px;
    height: 200px;
    background-color: #fff; //设置白色背景色
    padding: 6px; // 利用padding的特性，挤出白边
  } */
}
.link-box {
  > div {
    text-align: center;
    margin-bottom: 10px;
  }
  .mylink {
    margin-right: 10px;
    a {
      color: $primary;
    }
  }
}
</style>
